<template>
  <div class="main-container" style="height: 100%; background: white">
    <a-tabs   :lazy-load="true" type="card" justify @change="tabsChange" :default-active-key="pageData.tableIndex">
      <a-tab-pane title="创建申购单" key="1">
        <div style="height: 100%">
          <CreateOrder></CreateOrder>
        </div>
      </a-tab-pane>

      <a-tab-pane title="申购单审核" key="2">
        <div style="height: 100%">
          <ReviewForm></ReviewForm>
        </div>
      </a-tab-pane>
      <a-tab-pane title="申购单反审" key="3">
        <div style="height: 100%">
          <RequestFormVue></RequestFormVue>
        </div>
      </a-tab-pane>
      <!-- <a-tab-pane title="创建采购单" key="4">
        <div style="height: 100%">
          <OrderOfPurchase></OrderOfPurchase>
        </div>
      </a-tab-pane>

      <a-tab-pane title="采购单审核" key="5">
        <div style="height: 100%">
          <PurchaseInquiry></PurchaseInquiry>
        </div>
      </a-tab-pane>
      <a-tab-pane title="采购单反审" key="6">
        <div style="height: 100%">
          <PurchaseReview></PurchaseReview>
        </div>
      </a-tab-pane> -->
    </a-tabs>
  </div>
</template>

<script lang="ts">
import { defineComponent, reactive, ref,getCurrentInstance } from 'vue'
import CreateOrder from '@/components/pcsingmagent2/purchase/CreateOrder.vue'
import ReviewForm from '@/components/pcsingmagent2/purchase/ReviewForm.vue'
import RequestFormVue from '@/components/pcsingmagent2/purchase/RequestForm.vue'
// import OrderOfPurchase from '@/components/pcsingmagent2/purchase/OrderOfPurchase.vue'
// import PurchaseReview from '@/components/pcsingmagent2/purchase/PurchaseReview.vue'
// import PurchaseInquiry from '@/components/pcsingmagent2/purchase/PurchaseInquiry.vue'

import emitter from '@/hooks/useEventBus'
export default defineComponent({
  name: 'Purchase',
  components: {
    CreateOrder,
    ReviewForm,
    RequestFormVue,
    // OrderOfPurchase,
    // PurchaseReview,
    // PurchaseInquiry,
  },
  setup() {
    const { proxy } = getCurrentInstance()
    const tabValue = ref<any>(proxy.$route.query.key)
    const pageData = reactive({
      tableIndex: tabValue.value,
    })

    const tabsChange = (e: string | number) => {
      emitter.emit('window-change')
    }
    return {
      pageData,
      tabsChange,
    }
  },
})
</script>
<style scoped>
:deep(.ag-cell) {
  border-right: 1px solid #dde2eb;
}

:deep(.ag-header-cell) {
  border-right: 1px solid #dde2eb;
}
:deep(.ag-cell-value) {
  user-select: initial;
  -moz-user-select: text;
  -ms-user-select: text;
  -webkit-user-select: text;
}
</style>